import { Component, ViewChild, ElementRef } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { BuildingsDataProvider } from '../../providers/buildings-data/buildings-data';
import { Buildings } from '../../providers/buildings-data/buildings';
import { AboutPage } from '../about/about';





// 声明高德地图对象AMap
declare var AMap:any;

@Component({
  selector: 'page-department-service',
  templateUrl: 'department-service.html',
})
export class DepartmentServicePage {
  @ViewChild('map_container') map_container:ElementRef;


  private map: any;
  private buildings : Buildings[]=[];
  private markers:any[]=[];

  constructor(public navCtrl: NavController, 
    public navParams: NavParams,
    public buildingsDataProvider:BuildingsDataProvider) {
  }

  ionViewDidLoad() {
    this.initAMap();
    //this.setMarker(this.buildings);
    this.setData();
  }

  initAMap(){
    this.map = new AMap.Map(this.map_container.nativeElement, {
      resizeEnable: true,
      zoom:17,//级别
      center: [116.013742,29.679752],//中心点坐标
    });

    // 加载插件
    AMap.plugin(['AMap.ToolBar','AMap.Geolocation'],()=>{
      this.map.addControl(new AMap.ToolBar());
      let geolocation = new AMap.Geolocation();
      geolocation.getCurrentPosition(
        (status,result)=>{
          console.log(`精确定位:${status}`);
          console.log(result);          
        }
      );
      geolocation.getCityInfo(
        (status,result)=>{
          console.log(`城市定位: ${status}`);
          console.log(result);     
          // this.navCtrl.push(AboutPage, { park: result });     
        }
      );
      
      this.map.addControl(geolocation);
     }
    );

  }  


   /**
   * 在高德地图中设置标注
   * @param parks 
   */
  setMarker(buildings:Buildings[]){
    buildings = buildings.slice(0,3);
    console.log(buildings);
    

    buildings.forEach(buildings => {
      let [lng,lat] = buildings.point.split(',');
      let marker = new AMap.Marker({
        // position: new AMap.LngLat(116.013742,29.679752),
        // title: 'title测试',
        // label: {content: '九江学院学生公寓31栋', offset: new AMap.Pixel(20, -10)}
        position: new AMap.LngLat(lng,lat),
        title: buildings.name,
        label: {content: buildings.name, offset: new AMap.Pixel(20, -10)},
        clickable : true
      });
      marker.on('click',event=>{
        // console.log(`所在位置：[${event.lnglat.getLat()},${event.lnglat.getLng()}]`);
        //  console.log(`公寓详情：[${ buildings.intro}]`);
        
        // this.buildingsDataProvider.getBuildings(buildings.objectId).subscribe(buildings => {
          console.log(buildings.point);
          console.log("sadxce");
        this.navCtrl.push(AboutPage, {name:buildings.name,point:buildings.point});
        // console.log(buildings);
        // this.navCtrl.push(AboutPage, {tro:buildings.intro});
        
      });
      // console.log(buildings.name);
      // console.log("xascxd");
      
      
      this.markers.push(marker);

      
    });
      
   
    
    this.map.add(this.markers);
    console.log(this.markers);
    
  }

  setData(){
    this.buildings = [];

    // this.buildingsDataProvider.getCount().toPromise()
    // .then(total=>{
    //   console.log(`记录总数：${total}`);
    //   return this.buildingsDataProvider.getAllBuildings(total).toPromise();
    // })
    // .then(data=>{
    //   data.forEach(_buildings => {
    //     this.buildings = this.buildings.concat(_buildings);
    //   });
    //   console.log(`Buildings集合大小：${this.buildings.length}`);
      
    // }) 
    this.buildingsDataProvider.getBuildingsFromCache()
    .then(res=>{
      if (res && res.rows && res.rows.length > 0) {
        console.log(`查询结果集：${res.rows.length}`);
        for (let i = 0; i < res.rows.length; i++) {
          this.buildings.push({
            objectId: res.rows.item(i).objectId,
            name: res.rows.item(i).name,
            point: res.rows.item(i).point
          }as Buildings);
        }
      }
    })
    .then(() => {
      this.setMarker(this.buildings);
    });;


    // this.parkDataProvider.getParksFronCache()
    //   .then(res=>{
    //     if (res && res.rows && res.rows.length >0) {
    //       console.log(`查询结果集：${res.rows.length}`);
    //       for (let i = 0; i < res.rows.length; i++) {
    //         this.parks.push({
    //           objectId:res.rows.item(i).objectId,
    //           name: res.rows.item(i).name,
    //           point:res.rows.item(i).point
    //         }as Park);
            
    //       }
    //     }
    //   })
    // ;
  }


  // setEvent() {
  //   this.map.on('moveend', () => { this.setData(); });
  //   this.map.on('zoomend', () => { this.setData(); });

  // }

  
  

  

}
